<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@include file="/WEB-INF/mytag.jspf"%>

<!DOCTYPE html>
<html>
<head>
<base href="<%=basePath%>">
<title>user</title>
<script type="text/javascript">
function search(){ 
    	//判断参数是否都有填
    	$("#error").text("");
    	var message="";
    	var begDate = $("#begDate").val();
    	if(begDate==null||begDate==""){
    		message+="请选择起始日期";
    		$("#error").text(message);
    		return;
    	}
    	var endDate = $("#endDate").val();
    	if(endDate==null||endDate==""){
    		message+="请选择截止日期";
    		$("#error").text(message);
    		return;
    	}
    	//通过ajax查询数据，回填到yemi
    	$("#queryForm").ajaxSubmit({
			dataType : "json",
			success : function(data) {
				backFile(data);
			}
		});
    }
function backFile(list){
	$("#tab").empty();
	for(var i=0;i<list.length; i++){
		var trHTML = "<tr><td class='cen'>"+list[i].shopName+"</td>"+//门店
		"<td class='cen'>"+list[i].shopResult+"</td>"+//门店总业绩
		"<td class='cen'>"+list[i].shopItemResult+"</td>"+//门店项目业绩
		"<td class='cen'>"+list[i].shopOutResult+"</td>"+//门店外面业绩
		
		"<td class='cen'>"+list[i].cashPayAmount+"</td>"+//现金支付总金额
		"<td class='cen'>"+list[i].cardPayAmount+"</td>"+//刷卡支付总金额
		"<td class='cen'>"+list[i].alipayPayAmount+"</td>"+//支付宝支付总金额
		"<td class='cen'>"+list[i].bulkPayAmount+"</td>"+//团购支付总金额
		"<td class='cen'>"+list[i].balancePayAmount+"</td>"+//余额支付总金额
		"<td class='cen'>"+list[i].onlinePayAmount+"</td>"+//在线支付总金额
		
		"<td class='cen'>"+list[i].customTotle+"</td>"+//客流总量
		"<td class='cen'>"+list[i].hotCustom+"</td>"+//熟客
		"<td class='cen'>"+list[i].strangerCustom+"</td>"+//生客
		"<td class='cen'>"+list[i].mcustom+"</td>"+//男客
		"<td class='cen'>"+list[i].wcustom+"</td>";//女客
		var typelist = list[i].list;
		for(var j=0;j<typelist.length;j++){
			trHTML+="<td class='cen'>"+typelist[j].num+"</td>";//数量
			if(typelist[j].amount==null||typelist[j].amount==""){
				trHTML+="<td class='cen'>0</td>";//金额
			}else{
				trHTML+="<td class='cen'>"+typelist[j].amount+"</td>";//金额
			}
			trHTML+="<td class='cen'>"+typelist[j].percent+"</td>";//百分比
		}
		
		trHTML+="<td class='cen'>"+list[i].shopPaidResults+"</td>"+//充值业绩
		"</tr>"
		$("#tab").append(trHTML);//在table最后面添加一行
	}
	
	
}
</script>
<style type="text/css">
 .cen{
 	text-align: center;
 }
</style>
</head>

<body>
	<ol class="am-breadcrumb am-breadcrumb-slash am-padding" style="margin-bottom: 0px;">
		<li><a href="management/index">首页</a></li>
		<li class="am-active">门店业绩报表</li>
	</ol>
	<div class="am-g">
	    <div class="am-u-md-12">
		<form id="queryForm" class="am-form-inline" role="form" action="management/report/getShopReport" method="post">
		  <div class="am-form-group">
		    <input class="am-form-field" type="text" name="begDate" id="begDate" placeholder="请输选择起始日期"  data-am-datepicker readonly>
		  </div>
		  
		  <div class="am-form-group">
		    <input class="am-form-field" type="text" name="endDate" id="endDate" placeholder="请输选择截止日期"  data-am-datepicker readonly>
		  </div>
		  <button id ="searchBtn" onclick="search()" type="button" class="am-btn am-btn-default">搜索</button>
		  <label id="error" style="color: red;"></label>
		</div>
		</form>
	</div>
	<div class="am-g am-padding-vertical">
		<div class="am-u-md-12">
			<table id="grid" border=1 style="width:100%;" cellspacing=0 cellpadding=0 bordercolordark="#000000" bordercolorlight="#ffffff">
			    <thead>
			        <tr>
			            <th class="cen" rowspan="2" >门店</th>
			            <th  class="cen" rowspan="2">业绩</th>
			            <th  class="cen" rowspan="2">项目业绩</th>
			            <th  class="cen" rowspan="2">外卖业绩</th>
			            <th class="cen" colspan="6">业绩消费支付方式</th>
			            <th class="cen" colspan="5">客流情况</th>
			            <c:forEach items="${t}" var="a"> 
			            <th class="cen" colspan="3">${a.name}</th>
			            </c:forEach>
			            <th  class="cen" rowspan="2">充值业绩</th>
			        </tr>
			        <tr>
			        	<th  class="cen" >现金</th>
			        	<th  class="cen" >信用卡</th>
			        	<th  class="cen" >支付宝</th>
			        	<th  class="cen" >团购</th>
			        	<th  class="cen" >储值卡</th>
			        	<th  class="cen" >微信</th>
			        	
			        	<th  class="cen" >总客数</th>
			            <th  class="cen" >熟客</th>
			            <th  class="cen" >生客</th>
			            <th  class="cen" >男客</th>
			            <th  class="cen" >女客</th>
			            <c:forEach items="${t}" var="a"> 
			            <th  class="cen" >数量</th>
			            <th  class="cen" >金额</th>
			            <th  class="cen" >占项目业绩比例</th>
			            </c:forEach>
			        </tr>
			    </thead>
			    <tbody id="tab">
		    </tbody>
		</table>
		</div>
	</div>
</body>
</html>
